<template>
	<cl-dialog
		:visible.sync="visible"
		title="小程序链接"
		width="500px"
		:props="{
			appendToBody: true,
			closeOnClickModal: false
		}"
		:controls="['close']"
	>
		<div class="link">
			<p class="desc mb-1">点击链接完成复制</p>
			<el-button type="primary" plain v-clipboard:copy="link">
				{{ link }}
			</el-button>
		</div>
		<template #footer>
			<el-button @click="visible = false">关闭</el-button>
		</template>
	</cl-dialog>
</template>
<script>
export default {
	data() {
		return {
			visible: false,
			vmPhone: {},
			link: ""
		};
	},
	methods: {
		async open(link) {
			this.link = link;
			this.visible = true;
		}
	}
};
</script>
<style lang="scss" scoped>
.link {
	text-align: center;
	margin: 10px 0;
	.el-button--primary.is-plain {
		&:hover,
		&:focus {
			background-color: mix(#fff, $primary, 90%);
			border-color: $color-primary;
			color: $color-primary;
		}
	}
}
</style>
